<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>个人中心</title>
		<link rel="stylesheet" href="./css/ydui.rem.css" />
		<link rel="Shortcut Icon" href="./img/favicon-20191231054058871.ico" type="image/x-icon" />
		<style></style>
	</head>
	<body>
		<div id="app">
			<div>
				<p>我的</p>
				<p><button οnclick="clickCounter()" type="button">点我！</button></p>
				<div id="result"></div>
				<p>点击该按钮查看计数器的增加。</p>
				<p>关闭浏览器选项卡(或窗口),重新打开此页面,计数器将继续计数(不是重置)。</p>
			</div>
			<!-- 底部导航 -->
			<yd-tabbar fixed active-color="#F49518">
				<yd-tabbar-item title="首页" link="shoping_cart.html" type="a">
					<yd-icon name="home" slot="icon" size="0.54rem"></yd-icon>
				</yd-tabbar-item>
				<yd-tabbar-item title="购物车" link="cart.html" type="a">
					<yd-icon name="shopcart" slot="icon" size="0.54rem"></yd-icon>
				</yd-tabbar-item>
				<yd-tabbar-item title="个人中心" link="myine.html" active type="a">
					<yd-icon name="ucenter-outline" slot="icon" size="0.54rem"></yd-icon>
				</yd-tabbar-item>
			</yd-tabbar>
		</div>
		<!-- 引入 Vue -->
		<script src="./js/vue.js"></script>
		<!-- 引入组件库 -->
		<script src="./js/ydui.rem.js"></script>
		<!-- 引入rem自适应类库 -->
		<script src="./js/ydui.flexible.js"></script>
		<script src="./js/axios.js"></script>
		<script>
			new Vue({
				el: '#app',
				data() {
					return {}
				},
				methods: {
					clickCounter() {
						if (typeof(Storage) !== "undefined") {
							if (localStorage.clickcount) {
								localStorage.clickcount = Number(localStorage.clickcount) + 1;
							} else {
								localStorage.clickcount = 1;
							}
							document.getElementById("result").innerHTML = " 你已经点击了按钮 " + localStorage.clickcount + " 次 ";
						} else {
							document.getElementById("result").innerHTML = "对不起，您的浏览器不支持 web 存储。";
						}
					}
				},
				created() {

				},
				mounted() {}
			})
		</script>
	</body>
</html>
